<!--信号选择-->
<template>
  <div class="bg" @viewappear="viewappear" @viewdisappear="viewdisappear">
    
    <VSubMenu class="menu" :menus="menus" :menu="menu" @menuClick="menuClick" />


    <div class="all" v-if="datas && !datas.length" >
      <VTips
      :text="['当前暂无信号', '点击下方按钮创建吧～']" image="list_kong.png"
      :width="283" :height="238">
        <div class="row jcenter">
          <div class="tips-add main1" @click="addClick">
            <text class="font32 text1">{{'创建信号'}}</text>
          </div>
        </div>
      </VTips>
    </div>
    <list v-else class="list" :loadmoreoffset="50" @loadmore="loadmore">
      <refresh class="refresh" @refresh="refresh" :display="isRefresh ? 'show' : 'hide'">
        <loading-indicator class="load text1"></loading-indicator>
      </refresh>

      <cell v-for="(item, index) in datas" v-bind:key="index">
        
        <div class="cell bg2" v-if="item.signalName" @click="cellClick(item)">

          <LImage v-if="menu==0" class="img-logo" :src="Config.img('zidingyi.png')" />
          <LImage v-else-if="menu==1" class="img-logo" :src="Config.img('jiagejingbao.png')" />
          
          <text class="font28 text1 all">{{item.signalName}}</text>

          <LImage class="arrow-right-image" :src="Config.img('youjin.png')"></LImage>
          
          <div class="line bg3"></div>
        </div>

        <div class="genduo" v-else>
          <text class="font22 text3">{{T('没有更多数据')}}</text>
        </div>
      </cell>
    </list>
  </div>
</template>

<script>

//组件

//功能
import jconfig from "@/_js/config";
import jmodal from "@/_js/modal";
import jhttps from "@/_js/https";
import jbroadcast from "@/_js/broadcast";
import jnavigator from "@/_js/navigator";

const weexFunction = weex.requireModule('WeexFunction');

import I18N from "@/_i18n/i18n";
var T = I18N.t;
weexFunction.setTitle(T('选择信号'));

import VSubMenu from '@/_public/VSubMenu.vue'
import VTips from '@/_public/VTips.vue'
export default {

  components: {
    VSubMenu,
    VTips
  },
  
  data() {
    return {
      T:T,
      Config: jconfig,

      menus:['Vtrading信号', 'TradingView自定义'],
      menu:0,

      isRefresh:false,
      isLoadinging: false,
      pageMax:false,
      pageNo:1,
      pageSize:20,
      datas:undefined,
    };
  },

  mounted() {
    this.refresh();
  },
  
  
  computed: {

    //交易所对象
    url() {
      if (this.menu == 0) {
        return 'signal/getSignalList' ;
      }

      if (this.menu == 1) {
        return 'signal/getTradingViewSignalList' ;
      }
    },
  },
  methods: {
    /************************************************* 通信触发*/
    //完全显示
    viewappear() {
      this.refresh();
    },

    //完全隐藏
    viewdisappear() {
    },

    /************************************************* 其他*/
    refresh() {
      if (this.isRefresh) return;
      this.isRefresh = true;
      this.pageNo = 1;
      this.httpsGetSignalList();
    },

    //加载
    loadmore() {
      if (this.pageMax || this.isRefresh || this.isLoadinging) return;
      this.isLoadinging = true;
      this.httpsGetSignalList();
    },

    initDatas(datas) {

      datas.forEach((item)=>{
        item.createTimeStr = jtime.getTime(item.createTime);
        item.statesBol = item.states=='execute';
      });
      return datas;
    },

    /********************************************** https*/
    //https 信号列表
    httpsGetSignalList(){

      var param = {"pageNo": this.pageNo, "pageSize": this.pageSize}
      jhttps.post(this.url, param,true,(data)=>{
        
        this.isRefresh = false;
        if(data.status == 200){

          var datas = data.data;
          if(this.pageNo == 1) {
            this.datas = datas;
          } else {
            this.datas.push(...datas);
          }

          this.pageMax = datas.length < this.pageSize;
          if (this.pageMax && this.datas.length) {
            this.datas.push({});
          }

          this.pageNo++;
        }else{
          jmodal.toast(data.msg);
        }
      });
    },

    /********************************** 点击*/
    //菜单点击
    menuClick(menu){
      if (this.menu == menu) return;
      this.menu = menu;
      this.datas = undefined;
      this.refresh();
    },

    //列表点击
    cellClick(item) {

      jmodal.showLoad();
      jbroadcast.send('SelectSignal', item);
      jnavigator.back();
      setTimeout(() => {
        jmodal.hideLoad();
      }, 500);
    },

    //创建信号
    addClick() {
      if (!jconfig.forceLogin()) return;

      var array = ['Vtrading信号', 'TradingView自定义'];
      var dict = {'Vtrading信号':'signal/SignalAddV', 
                  'TradingView自定义':'signal/SignalAddT'};

      jmodal.actionSheet(array, '', (value)=>{
        var url = dict[value];
        jnavigator.open('', url);
        jbroadcast.subscribeOnce('SignalAdd', ()=>{
          this.refresh();
        });
      });
      return;
      
    }
  }
}
</script>

<style src="@/_css/style.css" ></style>
<style scoped>
.bg {
  width: 750px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.menu {
  height: 80px;
}
.list {
  margin-top: 20px;
  flex: 1;
}

.tips {
  flex: 1;
}
.tips-add{
  align-items: center;
  justify-content: center;
  width: 380px;
  height: 80px;
  background-color: #1677FE;
  border-radius: 40px;
  margin-top: 40px;
}

.cell {
  flex-direction: row;
  align-items: center;
  height: 100px;
  padding: 0 40px;
}
.img-logo {
  width: 50px;
  height: 50px;
  margin-right: 30px;
}
.arrow-right-image {
  width: 20px;
  height: 20px;
}
.line {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;

  height: 1px;
}
.refresh {
  width: 750;
  flex-direction: row;
  justify-content: center;
}
.load {
  margin-top: 16px;
  height: 40px;
  width: 40px;
}
.genduo {
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 750px;
  height: 100px;
}
</style>